<template>
    <div>
        <el-breadcrumb separator="/">
            <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item>营销管理</el-breadcrumb-item>
            <el-breadcrumb-item>课程秒杀</el-breadcrumb-item>
        </el-breadcrumb>
        <el-card>
          <h3 style="text-align: left;border-bottom:1px solid gainsboro;padding-bottom: 5px">秒杀</h3>
          <el-form :inline="true"  class="demo-form-inline" style="text-align: left" ref="searchbox">
            <el-form-item label="名称">
              <el-input v-model="name" placeholder="请输入名称"></el-input>
            </el-form-item>

            <el-form-item label="状态">
              <el-select v-model="status" placeholder="请选择状态">
                <el-option label="全部" value="0"></el-option>
                <el-option label="未开始" value="1"></el-option>
                <el-option label="进行中" value="2"></el-option>
                <el-option label="已结束" value="3"></el-option>
              </el-select>
            </el-form-item>

            <el-form-item>
              <el-button type="primary" @click="search">查询</el-button>
              <el-button  @click="resetBox">重置</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      <el-card style="margin-top: 30px">

            <h3 style="text-align: left;border-bottom:1px solid gainsboro;padding-bottom: 5px">秒杀列表
              <div style="float: right;margin-right: 30px;">
                <el-button type="primary" size="mini" @click="showAdd">新建</el-button>
              </div>
            </h3>
            <el-table :data="seckillList" border stripe>
              <el-table-column type="index"></el-table-column>
              <el-table-column label="活动名称" prop="name"></el-table-column>
              <el-table-column label="秒杀说明" prop="introduce"></el-table-column>
              <el-table-column label="活动状态" prop="status">
                <template slot-scope="scope">
                  <b style="color:#0000ff" v-show="scope.row.status==1">{{caseStatusArr[1]}}</b>
                  <b style="color:#3cb371" v-show="scope.row.status==2">{{caseStatusArr[2]}}</b>
                  <b style="color:#ff0000" v-show="scope.row.status==3">{{caseStatusArr[3]}}</b>
                </template>
              </el-table-column>
              <el-table-column label="开始时间" prop="starttime"></el-table-column>
              <el-table-column label="结束时间" prop="endtime"></el-table-column>
                <el-table-column label="操作" width="250px">
                    <template slot-scope="scope">
<!--                        <el-button type="info" size="mini" @click="showData(scope.row.id)">数据</el-button>-->
                        <el-button type="warning" size="mini" @click="showChange(scope.row)">编辑</el-button>
                        <el-button type="danger" size="mini" v-show="scope.row.status==2" @click="stopIt(scope.row.id)">立即停止</el-button>
                        <el-button type="success" size="mini" v-show="scope.row.status==1" @click="startIt(scope.row.id)">立即开始</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="pageNum"
                    :page-sizes="[5, 10 , 15, 20]"
                    :page-size="pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total"
            ></el-pagination>
        </el-card>


    </div>
</template>
<script>
    import AddDiscount from "@/backstage_1/Market/AddDiscount";

    export default {
        data() {
            return {
                nginxUrl:this.$MyUrl.imgUrl + "course/",
                pageNum: 1,
                pageSize: 10,
                total: 0,
                name:'',
                status:'',
                seckillList:[],
                caseStatusArr:{
                  1:"未开始",
                  2:"进行中",
                  3:"已结束",
                },
                addDialogVisible: false,
                addForm: {



                },
                addFormRules: {


                },
                value1: [],
                value2: [],
                changeDialogVisible:false,
                changeForm:{

                },
            };
        },
        methods: {



            showData(id){

            },
            cancelChange(){
              this.changeDialogVisible = false;
              this.changeForm={};
              this.value2=[];
            },
            doChange(){

            },
            showChange(obj){
              let jsonStr = JSON.stringify(obj);
              sessionStorage.setItem("changeSeckill",jsonStr);
              this.$router.push("/changeSeckill");

            },

            showAdd(){
              this.$router.push("/AddSeckill");
            },



            startIt(id){
              let url = "seckill/start";
              console.log(id);
              this.$axios.delete(url,{
                params:{
                  id:id,
                }
              }).then(res=>{
                if (res.data.code == 200){
                  this.$message({
                    type: 'success',
                    message: res.data.msg,
                    duration: 1000
                  })
                  setTimeout(this.reloadData,500);
                }else{
                  this.$message({
                    type:"error",
                    message:res.data.msg,
                    duration:1000
                  })
                }
              })
            },
            stopIt(id){
              let url = "seckill/stop";
              this.$axios.delete(url,{
                params:{
                  id:id,
                }
              }).then(res=>{
                if (res.data.code == 200){
                  this.$message({
                    type: 'success',
                    message: res.data.msg,
                    duration: 1000
                  })

                  setTimeout(this.reloadData,500);
                }else{
                  this.$message({
                    type:"error",
                    message:res.data.msg,
                    duration:1000
                  })
                }
              })
            },
            resetBox(){
                this.name="";
                this.status="";
                this.getSeckill();
            },
            handleSizeChange(newSize) {
                this.pageSize = newSize;
                this.getSeckill();
            },
            handleCurrentChange(newPage) {
                this.pageNum = newPage;
                this.getSeckill();
            },
            search(){
              this.pageNum = 1;
              this.getSeckill();
            },
          //初始化所有折扣
            getSeckill(){
              let url = "seckill/showSeckill";
              this.$axios.get(url,{
                params:{
                  now:this.pageNum,
                  size:this.pageSize,
                  name:this.name,
                  status:this.status,
                }
              }).then(res=>{
                if (res.data.code == 200){
                  this.seckillList = res.data.data.list;
                  this.pageNum = res.data.data.pageNum;
                  this.pageSize = res.data.data.pageSize;
                  this.total = res.data.data.total;

                }else {
                  this.$message({
                    type:"error",
                    message:res.data.msg,
                    duration:1000
                  })
                }
              });
            },

            reloadData() {
              this.getSeckill();
            }
        },
        created() {
            this.reloadData();

        }
    };
</script>
<style lang="less" scoped>
</style>